<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="/wechat/css/LArea.min.css"/>
    <link rel="stylesheet" type="text/css" href="/wechat/css/public.css" />
    <link rel="stylesheet" type="text/css" href="/wechat/layui/css/layui.css" />
    <link rel="stylesheet" type="text/css" href="/wechat/css/style.css" />
    <meta name="csrf-token" content="{{ csrf_token() }}"/>

</head>

<body>
<div class="logos">
    <img src="/wechat/img/logo.png" />
</div>
<form class="layui-form" action="" method="post" id="submit_regist">
    {{ csrf_field()  }}
    <div class="forms">
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>宝宝姓名</label>
            <div class="layui-input-block">
                <input type="text" name="name" required lay-verify="required" placeholder="宝宝姓名" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>出生日期</label>
            <div class="layui-input-block">
                <input type="text" name="birth" id="date1" autocomplete="off" class="layui-input" lay-verify="date" placeholder="请选择出生日期" readonly="readonly"  onfocus="this.blur()">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>宝宝性别</label>
            <div class="layui-input-block">
                <select name="sex" lay-verify="required">
                    <option value="">请选择宝宝性别</option>
                    <option value="0">女</option>
                    <option value="1">男</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>家长姓名</label>
            <div class="layui-input-block">
                <input type="text" name="guardian" required lay-verify="required" placeholder="家长姓名" autocomplete="off" class="layui-input">
            </div>
        </div>
{{--         <div class="layui-form-item">
            <label class="layui-form-label">家长手机</label>
            <div class="layui-input-block">
                <input type="tel" name="number" lay-verify="phone" autocomplete="off" class="layui-input" placeholder="请输入手机号">
            </div>
        </div> --}}
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>联系电话</label>
            <div class="layui-input-block">
                <input type="text" name="tel" required lay-verify="phone" placeholder="联系电话" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>户籍所在地</label>
            <div class="layui-input-block">
                <input type="text" name="habitual_residence" required lay-verify="required" placeholder="请选择户籍所在地" autocomplete="off" class="layui-input"  id="selectCity" readonly="readonly" onfocus="this.blur()">
                <input id="value2" type="hidden" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span>*</span>所属村居</label>
            <div class="layui-input-block">
                <select name="town_id" lay-verify="required">
                    <option value="">请选择所属村居</option>
                    @foreach($towns as $town)
                        <option value="{!! $town->id !!}">{!! $town->name !!}</option>
                    @endforeach
                </select>
            </div>
        </div>
    </div>
    <div class="btn-la">
        <button class="layui-btn" lay-submit lay-filter="formDemo" id="regist_form_submit_btn">提交</button>
    </div>
</form>
<!--注册成功弹窗-->
<div id="yySuccess">
    <img src="/wechat/img/su.png"/>
    <p class="p1">注册成功</p>
    <p>预约课程需通过管理员审核信息 <br> 请耐心等待审核!</p>
    <button class="layui-btn layui-btn-normal" id="yes_submit" style="height: 28px;line-height: 28px; margin-bottom: 0.1rem" >确定</button>
</div>
<!--测试弹窗-->
<div class="aa"></div>
<script src="/wechat/layui/layui.js" type="text/javascript" charset="utf-8"></script>
<!--城市选择插件-->
<script src="/wechat/js/LArea.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/wechat/js/LAreaData1.js" type="text/javascript" charset="utf-8"></script>
<script src="/wechat/js/LAreaData2.js" type="text/javascript" charset="utf-8"></script>
<script src="/wechat/js/common.js" type="text/javascript" charset="utf-8"></script>
<script src="/wechat/js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
<script>
$(function(){
    //alert('changes');
    // var area2 = new LArea();
    // area2.init({
    //     'trigger': '#selectCity',
    //     'valueTo': '#value2',
    //     'keys': {
    //         id: 'value',
    //         name: 'text'
    //     },
    //     'type': 2,
    //     'data': [provs_data, citys_data, dists_data]
    // });

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $submit_form = $('#submit_regist');
    $submit_form.on('submit', function(e){
        $('#regist_form_submit_btn').prop( "disabled", true );
        e.preventDefault();
        var data = $submit_form.serialize();
        $.ajax({
            method: 'post',
            url: '/wx/regist',
            data: data,
            dataType: 'json',
            success: function(data){
                if(data.result){
                    layer.open({
                        type:1,
                        title:'',
                        shadeClose:true,
                        area:['5rem','auto'],
                        content:$('#yySuccess'),
                        isOutAnim:true
                    })                              
                }
            }
        });
        return false;
    });
    $('#yes_submit').on('click', function(){
        window.location.href = "/wx/courses"
    });


    //注册成功弹窗测试
  // $('.aa').on('click',function(){
  //   layer.open({
  //       type:1,
  //       title:'',
  //       shadeClose:true,
  //       area:['5rem','auto'],
  //       content:$('#yySuccess'),
  //       isOutAnim:true
  //   })
  // });



})


</script>
</body>

</html>